<template>
	<view>
		<up-loading-page :loading="true" loadingText="loading..." v-if="showLoading"></up-loading-page>
	</view>
	<view class="layout" v-show="!showLoading">
		<!-- 组件 ,需要主页图片返回主页 加  ：isHome="true"-->
		<cu-custom :isBack="true"> 
			<block slot="content">订单详情</block>
		</cu-custom>
		
		<view class="group1" v-if="status === '待兑换'">
			<view class="text1">待兑换</view>
			
			<view style="display: flex; width: 710rpx;">
			<view class="text2">请于</view>
			<view style=" box-sizing: border-box;padding: 12rpx 0 0 0;
			"><up-count-down :time="30 * 30 * 10 * 1000" format="HH:mm:ss" autoStart millisecond @finish="finish"></up-count-down></view>
			<view class="text2">内付款，超时订单将自动关闭</view>
			</view>
			
		</view>
		<!-- 待发货 -->
		<view class="readyfa" v-if="status === '待发货'">
			<view class="readytitle">待发货</view>
			<view class="readydec">您的订单已发货，等待平台发货</view>
		</view>
		<!-- 等待收获 -->
		<view class="reaysou" v-if="status === '待收货'">
			<view class="reaysoutitle">等待收货</view>
		</view>
		<!-- 待核销 -->
		
		<view class="waithexiao" v-if="status === '待核销'">
			<view class="waitready">
				<view class="waititle">待核销</view>
				<view class="waitdec">您的订单已兑换成功，请点击核销码进行核销</view>
			</view>
			<!-- 二维码 -->
			<view class="waitcode" @click="showcode = true">
				<image src="../../static/qrcode.png" mode=""></image>
			</view>
		</view>
		
		<!-- 二维码 -->
		<up-popup :closeable="true" :customStyle="{ width:'480rpx',height:'540rpx' }" :round="10" mode="center" :show="showcode" @close="closecode" @open="opencode">
		    <view style="width: 100rpx; height: 26rpx; line-height: 26rpx; color: #000000;font-size: 28rpx; font-weight: 500;margin: 126rpx 0 0 199rpx;">
		        核销码
		    </view>
			<!-- 二维码 -->
			<view style="width: 160rpx;height: 160rpx;margin: 27rpx 0 0 157rpx;">
				
				<view v-for="(row, rowI) in modules" :key="rowI" style="display: flex; flex-direction: row;">
				  <view v-for="(col, colI) in row" :key="colI">
				    <view v-if="col.isBlack" style="width: 7rpx; height: 7rpx; background-color: black;">
				      <!-- 黑色码点 -->
				    </view>
				    <view v-else style="width: 7rpx; height: 7rpx; background-color: white;">
				      <!-- 白色码点 -->
				    </view>
				  </view>
				</view>
				
			</view>
			<!-- 二维码数字 -->
			<view style="width: 210rpx; height: 45rpx; line-height: 45rpx;
			 margin: 37rpx 0 0 135rpx;font-size: 60rpx; color: #18288F;">541725</view>
		</up-popup>
		
		
		
		
		
		<view class="address-list" v-if="status !== '待核销'">
			<!-- 图标 -->
			<view class="address-iconof">
				<image src="../../static/我的地址@2x.png" mode=""></image>
			</view>
			<view class="address-box">
				<!-- 标题 -->
				<view class="address-title">
					<view class="address-left">{{ addressObj.contact }} {{ addressObj.telephone }}</view>
				</view>
				
				<!-- 内容 -->
				<view class="address-content">
					<view class="address-sss">{{ region }}</view>
					<view class="address-dec">{{ addressObj.address }}</view>
				</view>
				<!-- 物流配送 -->
				<view class="address-wuliu">
					物流配送
				</view>
			</view>
		</view>
		
		<view class="group3">
			<view class="text1">商品</view>
			<view class="tw">
				<image class="img" src="../../static/pr1.png"></image>
					<view class="danjia">
						<view class="text3">{{ order_name }}</view>
							<view class="money">
								<view class="text4">{{ order_price }}积分</view>
									<view class="text5">x{{ order_sale }}</view>
							</view>
					</view>
			</view>
			<view class="note" v-if="status!=='待核销'">
				<view class="note1">留言</view>
				 <up-input class="input1"
				    placeholder="给卖家留言"
				    border="bottom"
				    clearable
					inputAlign="right"></up-input>
			</view>
			<view class="freight" v-if="status!=='待核销'">
				<view class="freight1">运费</view>
				 
				 <view class="input2">￥0.00</view>
			</view>
			<view class="pay">
				<view class="text10">{{ status === '待核销' ? '已支付' : '需支付' }}</view>
				<view class="text11">20积分</view>
			</view>
		</view>
		
		<view class="group4">
			<view class="text1">订单信息</view>
			<!-- 待兑换 -->
			<view style="padding: 0 0 39rpx 0;" v-if="status === '待兑换'">
				<view class="parse1">
					<view class="text2">订单编号：{{ order_id }}</view>
					<up-copy style="margin: 30rpx 0 0 0;" :content="order_id">
						<view style="width: 90rpx; height: 38rpx; border-radius: 10rpx; box-sizing: border-box; padding: 2rpx 0 0 22rpx;
						border: 1px solid #efefef; font-size: 26rpx; color: #666666;">复制</view>
					</up-copy>
				</view>
				<view class="text3">下单时间：2021-04-05 09:04:20</view>
			
		</view>
		
		
			<!-- <view class="text4">付款时间：2021-04-05 09:05:14</view>
			<view class="text5">支付方式：积分</view>
			<view class="text6">配送方式：物流配送</view> -->
			
			<!-- 待发货 -->
			<view style="padding: 0 0 39rpx 0;" v-if="status === '待发货'">
				<view class="parse1">
						<view class="text2">订单编号：{{ order_id }}</view>
						<up-copy style="margin: 30rpx 0 0 0;" :content="order_id">
							<view style="width: 90rpx; height: 38rpx; border-radius: 10rpx; box-sizing: border-box; padding: 2rpx 0 0 22rpx;
							border: 1px solid #efefef; font-size: 26rpx; color: #666666;">复制</view>
						</up-copy>
					</view>
				<view class="text3">下单时间：2021-04-05 09:04:20</view>
				<view class="text4">付款时间：2021-04-05 09:05:14</view>
				<view class="text5">支付方式：积分</view>
				<view class="text6">配送方式：物流配送</view>
			</view>
			
			<!-- 等待收货 -->
			<view style="padding: 0 0 39rpx 0;" v-if="status === '待收货'">
				<view class="parse1">
					<view class="text2">订单编号：{{ order_id }}</view>
					<up-copy style="margin: 30rpx 0 0 0;" :content="order_id">
						<view style="width: 90rpx; height: 38rpx; border-radius: 10rpx; box-sizing: border-box; padding: 2rpx 0 0 22rpx;
						border: 1px solid #efefef; font-size: 26rpx; color: #666666;">复制</view>
					</up-copy>
				</view>
				<view class="text3">下单时间：2021-04-05 09:04:20</view>
				<view class="text4">付款时间：2021-04-05 09:05:14</view>
				<view class="text5">付款方式：积分</view>
				<view class="text7">发货时间：2022-07-22 10:53</view>
				<view class="text8">物流公司：中通物流</view>
				<view class="parse2">
					<view class="text9">物流单号：23432848238</view>
					<up-copy style="margin: 10rpx 0 0 0;" content="23432848238">
						<view style="width: 90rpx; height: 38rpx; border-radius: 10rpx; box-sizing: border-box; padding: 2rpx 0 0 22rpx;
						border: 1px solid #efefef; font-size: 26rpx; color: #666666;">复制</view>
					</up-copy>
				</view>
			</view>
			
			
			<!-- 待核销 -->
			<view style="padding: 0 0 39rpx 0;" v-if="status === '待核销'">
				<view class="parse1">
					<view class="text2">订单编号：{{ order_id }}</view>
					<up-copy style="margin: 30rpx 0 0 0;" :content="order_id">
						<view style="width: 90rpx; height: 38rpx; border-radius: 10rpx; box-sizing: border-box; padding: 2rpx 0 0 22rpx;
						border: 1px solid #efefef; font-size: 26rpx; color: #666666;">复制</view>
					</up-copy>
				</view>
				<view class="text3">下单时间：2021-04-05 09:04:20</view>
				<view class="text4">付款时间：2021-04-05 09:05:14</view>
				<view class="text5">付款方式：积分</view>
			</view>
			
			
			
			<!-- <view class="text7">发货时间：2022-07-22 10:53</view>
			<view class="text8">物流公司：中通物流</view> -->
			
			
			<!-- <view class="parse2">
				<view class="text9">物流单号：23432848238</view>
				<up-copy style="margin: 10rpx 0 0 0;" content="23432848238">
					<view style="width: 90rpx; height: 38rpx; border-radius: 10rpx; box-sizing: border-box; padding: 2rpx 0 0 22rpx;
					border: 1px solid #efefef; font-size: 26rpx; color: #666666;">复制</view>
				</up-copy>
			</view> -->
		</view>
		
		<view class="group5"></view>
		<!-- 待兑换 -->
		<view style="padding: 0 0 39rpx 0;" class="group6" v-if="status === '待兑换'">
			<view class="canconorder">
				<view class="btn1" @click="show = true">取消订单</view>
				<view class="btn2">去支付</view>
			</view>
		</view>
		<!-- 待发货 -->
		<view style="background: #ffffff;
		 position: fixed;bottom: 0rpx;border-radius: 20rpx 20rpx 0rpx 0rpx; width: 750rpx; height: 110rpx;" v-if="status === '待发货'">
				<view style="width: 200rpx;box-sizing: border-box;border-radius: 35rpx;color: #18288F;font-size: 28rpx;padding: 17rpx 0 0 45rpx;font-weight: 800;
				height: 70rpx;border: 1px solid #18288F; margin: 20rpx 0 0 523rpx;" @click="show = true">取消订单</view>
		</view>
		<!-- 待收货 -->
		<view style="padding: 0 0 39rpx 0;" class="group6" v-if="status === '待收货'">
			<view class="canconorder">
				<view class="btn1" >查看物流</view>
				<view style="width: 200rpx;
				height: 70rpx;
				background: #18288f;
				color: #ffffff;
				border-radius: 35rpx;
				box-sizing: border-box;
				font-size: 28rpx;
				font-weight: 800;
				margin: 0 0 0 16rpx;
				padding: 15rpx 0 0 45rpx;">确认收货</view>
			</view>
		</view>
		
		<!-- 待核销 -->
		<view v-if="status === '待核销'" style="background: #ffffff;padding: 0 0 39rpx 0;
		 position: fixed;bottom: 0rpx;border-radius: 20rpx 20rpx 0rpx 0rpx; width: 750rpx; height: 110rpx;">
			<view style="width: 200rpx;box-sizing: border-box;border-radius: 35rpx;color: #18288F;font-size: 28rpx;padding: 17rpx 0 0 45rpx;font-weight: 800;
			height: 70rpx;border: 1px solid #18288F; margin: 20rpx 0 0 523rpx;" @click="show = true">取消订单</view>
		</view>
		
		
		<up-popup :round="10" mode="center" :closeable="true" :show="show" @close="close" @open="open" :customStyle="{ width:'540rpx' }">
		            <view class="popbox" style="width: 500rpx;">
		                <h1 style="width: 209rpx; line-height: 26rpx; margin: 39rpx 0 0 62rpx;
						 height: 26rpx;font-size: 28rpx; color: #000000; font-weight: 800;">订单取消</h1>
						 
						 <!-- 选择框 -->
						 <picker mode="selector" :range="reasons" @change="onReasonChange">
						   <view style="width: 420rpx; height: 80rpx;box-sizing: border-box; padding: 15rpx 0 0 19rpx;color: #666666;position: relative;border-radius: 10rpx;
							border: 1px solid #efefef; margin: 37rpx 0 0 60rpx;">
						     {{ selectedReason || '选择取消订单原因' }}   	<view style="top: 18rpx; right: 37rpx;  position: absolute; color: #A0A0A0;">▼</view>
						   </view>
						 </picker>
						 
						 <!-- 按钮 -->
						 <view style="width: 420rpx; height: 70rpx; margin: 31rpx 63rpx; display: flex;">
							 <!-- 左右按钮 -->
							 <view @click="show = false" style="border: 1px solid #18288F ; box-sizing: border-box; padding: 15rpx 0 0 49rpx;
							 font-size: 26rpx;color: #18288F ;font-weight: 800;
							 width: 200rpx; height: 70rpx; border-radius: 35rpx;">暂不取消</view>
							 
							 <!-- 右边按钮 -->
							 <view style="background: #18288F; box-sizing: border-box; padding: 16rpx 0 0 49rpx;
							 font-size: 26rpx;color: #ffffff ;margin: 0 0 0 11rpx;font-weight: 800;
							 width: 200rpx; height: 70rpx; border-radius: 35rpx;">确定取消</view>
						 </view>
					</view>
		</up-popup>
	</view>
</template>

<script setup>
import { reactive,ref,onMounted } from 'vue'; 
import { onLoad,onReady } from '@dcloudio/uni-app'
import request from '@/common/request.js';
import {loadingType} from '@/utils/type';
import UQRCode from '../../uni_modules/Sansnn-uQRCode/js_sdk/uqrcode/uqrcode.js';

const showLoading = ref(true)

onMounted(() => {
  setTimeout(() => {
    showLoading.value = false;
  }, 3000);
});


const show = ref(false);  
  
// 定义方法  
function open() {  
  // 打开逻辑，比如设置 show 为 true  
  show.value = true;  
  // console.log('open');  
}  
  
function close() {  
  // 关闭逻辑，设置 show 为 false  
  show.value = false;  
  // console.log('close');  
}  
// 下拉框
const reasons = ref(['不需要了', '贵了', '地址错了', '选错东西了', '其他','规格错了']);
const selectedReason = ref('');

const onReasonChange = (event) => {
  selectedReason.value = reasons.value[event.detail.value];
};

const addressObj = ref({
	  contact: '',
	  telephone: '',
	  province_id: '',
	  city_id: '',
	  district_id: '',
	  address: '',
	  uid: 0,
	  is_default: Boolean(0),
	});
	const region = ref('')
	// 页面加载时获取本地存储的数据
	onMounted(() => {
	  try {
	    const storedAddress = uni.getStorageSync('address');
		console.log("东西", storedAddress)
		addressObj.value.contact = storedAddress.contact
		console.log("拿到",addressObj.value.contact)
		region.value = storedAddress.region
		addressObj.value.address = storedAddress.addAddress
		
	    if (storedAddress) {
	      addressObj.value = storedAddress;
	    } else {
	      console.log('没有找到存储的地址信息');
	    }
	  } catch (e) {
	    console.error('获取地址失败', e);
	  }
	});
	
// load
const getdata = ref('')
const order_id = ref(0)
const order_name = ref('')
const order_price = ref(0)
const order_sale = ref(0)
const status = ref('')

onLoad((e)=>{
	console.log("我的订单",e)
	getdata.value = JSON.parse(e.data)
	console.log("我的订单东西转化",getdata.value)
	order_id.value = getdata.value.order_id
	order_name.value = getdata.value.order_name
	order_price.value = getdata.value.order_price
	order_sale.value = getdata.value.order_sale
	status.value = getdata.value.status
	
	// 东西
})
// 二维码
const showcode = ref(false)
function opencode(){
	showcode.value = true
}
function closecode(){
	showcode.value = false
}
// 生成二维码的函数
const modules = ref([]);
onMounted(() => {
  const qr = new UQRCode();
  qr.data = 'https://www.baidu.com';
  qr.make();
  modules.value = qr.modules;
});

// 倒计时
// 使用 reactive 创建响应式对象  
const timeData = ref({});  
  
// 定义 onChange 方法  



</script>

<style scoped lang="scss">
.layout {
	background: #f7f7f7;
	.readyfa {
		width: 750rpx;
		height: 190rpx;
		background: #ffffff;
		border: 1px solid #ffffff;
		
		.readytitle {
			width: 250rpx;
			height: 38rpx;
			font-size: 40rpx;
			font-weight: 800;
			margin: 30rpx 0 0 45rpx;
		}
		
		.readydec {
			width: 450rpx;
			height: 24rpx;
			line-height: 24rpx;
			color: #999999;
			font-size: 24rpx;
			margin: 40rpx 0 0 45rpx;
		}
	}
	
	.reaysou {
		width: 750rpx;
		height: 190rpx;
		line-height: 190rpx;
		background: #ffffff;
		border: 1px solid #ffffff;
		
		.reaysoutitle {
			width: 200rpx;
			height: 39rpx;
			line-height: 39rpx;
			font-size: 40rpx;
			font-weight: 800;
			color: #000000;
			margin: 30rpx 0 0 45rpx;
		}
	}
	
	// 核销
	.waithexiao {
		width: 750rpx;
		height: 190rpx;
		// line-height: 190rpx;
		background: #ffffff;
		// border: 1px solid #ff2c2f;
		display: flex;
		
		.waitready {
			width: 500rpx;
			height: 98rpx;
			// line-height: 98rpx;
			margin: 30rpx 0 0 45rpx;
			
			.waititle {
				width: 200rpx;
				height: 38rpx;
				font-weight: 800;
				font-size: 40rpx;
			}
			
			.waitdec {
				width: 479rpx;
				height: 24rpx;
				line-height: 24rpx;
				color: #999999;
				font-size: 24rpx;
				margin: 50rpx 0 0 0;
			}
		}
		
		.waitcode {
			width: 100rpx;
			height: 98rpx;
			line-height: 98rpx;
			// border: 1px solid red;
			margin: 40rpx 0 0 40rpx;
			
			image {
				width: 100%;
				height: 100%;
			}
		}
	}
	
	
	
	.group1{
		background-color: #ffffff;
		.text1{
			font-size: 40rpx;
			font-weight: bold;
			padding-left: 46rpx;
			padding-top: 70rpx;
		}
		.text2{
			font-size: 24rpx;
			padding-left: 47rpx;
			padding-top: 23rpx;
			color: #999999;
			padding-bottom: 30rpx;
		}
	}
	.address-list {
		width: 710rpx;
		height: 210rpx;
		line-height: 210rpx;
		// line-height: 210rpx;
		border: 1px solid #ffffff;
		margin: 15rpx 20rpx 0 20rpx;
		border-radius: 20rpx;
		background: #ffffff;
		display: flex;
		.address-iconof {
			width: 24rpx;
			height: 26rpx;
			line-height: 26rpx;
			margin: 94rpx 0 0 45rpx;
			
			image {
				width: 100%;
				height: 100%;
			}
		}
		
		.address-box {
			width: 451rpx;
			height: 130rpx;
			line-height: 130rpx;
			// border: 1px solid red;
			margin: 50rpx 0 35rpx 40rpx;
			background: #ffffff;
			
			
			.address-title {
				width: 451rpx;
				height: 40rpx;
				line-height: 40rpx;
				// border: 1px solid red;
				color: #222222;
				font-size: 30rpx;
				font-weight: 800;
				display: flex;
				
				.address-left {
					width: 408rpx;
					height: 40rpx;
					line-height: 40rpx;
					overflow: hidden;
					/* 隐藏超出部分 */
					white-space: nowrap;
					/* 不换行 */
					text-overflow: ellipsis;
				}
				
				// .address-icon {
				// 	width: 80rpx;
				// 	height: 40rpx;
				// 	line-height: 40rpx;
				// 	background: #f0f9f6;
				// 	color: #6ad6f5;
				// 	box-sizing: border-box;
				// 	padding: 4rpx 16rpx 0 14rpx;
				// 	font-size: 24rpx;
				// 	margin-left: 50rpx;
				// }
			}
			
			
			.address-content {
				width: 451rpx;
				height: 75rpx;
				line-height: 75rpx;
				font-size: 28rpx;
				color: #666666;
				
				.address-sss {
					width: 451rpx;
					height: 37rpx;
					line-height: 37rpx;
				}
				.address-dec {
					width: 451rpx;
					height: 37rpx;
					line-height: 37rpx;
					overflow: hidden;
					/* 隐藏超出部分 */
					white-space: nowrap;
					/* 不换行 */
					text-overflow: ellipsis;
				}
			}
			
			// 物流详细
			.address-wuliu {
				width: 110rpx;
				height: 23rpx;
				line-height: 23rpx;
				color: #999999;
				font-size: 24rpx;
				font-weight: 500;
				margin:  10rpx 0 0 20rpx;
			}
			
		}
	}
	.group3{
		background-color: #ffffff;
		width: 710rpx;
		margin-top: 20rpx;
		margin-left: 20rpx;
		border-radius: 15rpx;
		.text1{
			font-size: 24rpx;
			padding-left: 28rpx;
			padding-top: 32rpx;
			color: #353535;
		}
		.tw{
			display: flex;
			.img{
				width: 160rpx;
				height: 160rpx;
				border-radius: 10rpx;
				padding-left: 28rpx;
				padding-top: 35rpx;
			}
			.danjia{
				.text3{
					font-size: 28rpx;
					width: 490rpx;
					padding-left: 18rpx;
					padding-top: 25rpx;
				}
				.money{
					display: flex;
					.text4{
						padding-left: 18rpx;
						padding-top: 60rpx;
						font-size: 30rpx;
						color: #ff8400;
					}
					.text5{
						font-size: 24rpx;
						color: #cccccc;
						padding-left: 348rpx;
						padding-top: 60rpx;
					}
				}
			}
		}
		.note{
			width: 650rpx;
			height: 103rpx;
			display: flex;
			// border: 1px solid red;
			margin: 0 0 0 29rpx;
			.note1{
				width: 70rpx;
				height: 30rpx;
				line-height: 30rpx;
				font-size: 26rpx;
				margin: 40rpx 0 0 0;
			}
			.input1{
				margin-top: 70rpx;
				margin-right: 40rpx;
			}
		}
		.freight{
			width: 650rpx;
			height: 103rpx;
			// border: 1px solid red;
			display: flex;
			margin: 0 0 0 29rpx;
			.freight1{
				font-size: 28rpx;
				width: 67rpx;
				height: 30rpx;
				line-height: 30rpx;
				margin: 39rpx 0 0 0;
				// border: 1px solid red;
			}
			.input2{
				margin: 10rpx 0 0 30rpx;
				width: 550rpx;
				height: 103rpx;
				box-sizing: border-box;
				padding: 30rpx 0 0 400rpx;
				font-size: 28rpx;
				color: #666666;
				border-bottom: 1rpx solid #dadbde;
			}
		}
		.pay{
			display: flex;
			padding-top: 50rpx;
			padding-bottom: 30rpx;
			.text10{
				font-size: 28rpx;
				color: #999999;
				padding-left: 470rpx;
			}
			.text11{
				font-size: 28rpx;
				color: #ff8400;
				padding-left: 5rpx;
			}
		}
	}
	.group4{
		background-color: #ffffff;
		width: 710rpx;
		margin-left: 20rpx;
		margin-top: 15rpx;
		border-radius: 10rpx;
		.text1{
			font-size: 28rpx;
			padding-left: 27rpx;
			padding-top: 40rpx;
			font-weight: bold;
		}
		.parse1{
			display: flex;
			.text2{
				font-size: 26rpx;
				padding-left: 27rpx;
				padding-top: 32rpx;
				color: #666666;
			}
			.t1{
				font-size: 26rpx;
				width: 190rpx;
				height: 38rpx;
				padding-left: 15rpx;
				padding-top: 18rpx;
			}
		}
		.text3{
			font-size: 26rpx;
			padding-left: 27rpx;
			padding-top: 15rpx;
			color: #666666;
		}
		.text4{
			font-size: 26rpx;
			padding-left: 27rpx;
			padding-top: 15rpx;
			color: #666666;
		}
		.text5{
			font-size: 26rpx;
			padding-left: 27rpx;
			padding-top: 15rpx;
			color: #666666;
		}
		.text6{
			font-size: 26rpx;
			padding-left: 27rpx;
			padding-top: 15rpx;
			color: #666666;
		}
		.text7{
			font-size: 26rpx;
			padding-left: 27rpx;
			padding-top: 15rpx;
			color: #666666;
		}
		.text8{
			font-size: 26rpx;
			padding-left: 27rpx;
			padding-top: 15rpx;
			color: #666666;
		}
		.parse2{
			display: flex;
			padding-bottom: 40rpx;
			.text9{
				font-size: 26rpx;
				padding-left: 27rpx;
				padding-top: 15rpx;
				color: #666666;
			}
			.t2{
				font-size: 26rpx;
				width: 190rpx;
				height: 38rpx;
				padding-left: 15rpx;
				padding-top: 5rpx;
			}
		}
	}
	.group5{
		height: 350rpx;
	}
	.group6{
		position: fixed;
		bottom: 0rpx;
		width: 750rpx;
		height: 120rpx;
		background-color: #ffffff;
		border-radius: 50rpx 50rpx 0rpx 0rpx;
		
		.canconorder {
			width: 500rpx;
			height: 70rpx;
			// border: 1px solid red;
			display: flex;
			margin: 47rpx 0 0 230rpx;
			
			.btn1 {
				width: 200rpx;
				height: 70rpx;
				border: 1px solid #18288f;
				border-radius: 35rpx;
				box-sizing: border-box;
				font-size: 28rpx;
				font-weight: 800;
				padding: 15rpx 0 0 45rpx;
				margin: 0 0 0 70rpx;
				
			}
			.btn2 {
				width: 200rpx;
				height: 70rpx;
				background: #18288f;
				color: #ffffff;
				border-radius: 35rpx;
				box-sizing: border-box;
				font-size: 28rpx;
				font-weight: 800;
				margin: 0 0 0 16rpx;
				padding: 15rpx 0 0 59rpx;
			}
		}
		
	}
	}
</style>
